<template>
  <div>
    <h2>数据驱动视图</h2>
    <p>{{str}}</p>
  <button @click="aa">翻转事件</button>
  </div>
</template>

<script>
export default {
data () {
  return {
    str:'你好世界'
  }
},
methods: {
  aa () {
    this.str=this.str.split('').reverse().join('')
    console.log(this.str)
  }
}
}
</script>

<style>
.box {
  width: 300px;
  height: 100px;
  background-color: cadetblue;
}
</style>